<!-- 图表 -->
<template>
	<view>

		<view v-for="(item1, index1) in checklist" :key="index1">
			<block class="mone" v-for="(item, index) in item1" :key="index">
				<view class="qiun-charts" style="background-color: #FFFFFF;">
					<u-charts :canvas-id="item.id" :chartType="item.chartType" :cWidth="cWidth" :cHeight="cHeight" :opts="item.opts"
					 :ref="item.id" />
				</view>
			</block>
		</view>
		<!-- <text class="loadMore">{{ contentText }}</text> -->
	</view>
</template>

<script>
	import uCharts from '@/components/u-charts/component.vue';
	var _self;
	var canvaColumn = null;
	export default {
		components: {
			uCharts
		},
		data() {
			return {
				
				Aser: [],
				checklist: [],

				patId: 0,
				subId: 0,
				cWidth: '',
				cHeight: '',
				pixelRatio: 1,
				textarea: '',

				pullFlag: true,
				fetchPageNum: 1,
				refreshing: false,
				contentText: '上拉显示更多',
				pageSize: 10
			}
		},


		onLoad(options) {
			_self = this;
			_self.patId = options.patid;
			_self.subId = options.suid;
			uni.setNavigationBarTitle({
				title: options.name
			});
			//#ifdef MP-ALIPAY
			uni.getSystemInfo({
				success: function(res) {
					if (res.pixelRatio > 1) {
						//正常这里给2就行，如果pixelRatio=3性能会降低一点
						//_self.pixelRatio =res.pixelRatio;
						_self.pixelRatio = 2;
					}
				}
			});
			//#endif
			this.cWidth = uni.upx2px(750);
			this.cHeight = uni.upx2px(500);
			// this.getServerData();
		},
		onShow() {
			// this.fetchPageNum = 1;
			// this.pullFlag = true;
			// this.refreshing = false;
			this.getServerData();
		},
		// onReachBottom() {
		// 	console.log('滑动到页面底部');
		// 	this.contentText = '加载中...';
		// 	if (this.pullFlag) {
		// 		this.fetchPageNum += 1;
		// 		this.pulllists();
		// 	} else {
		// 		this.contentText = '暂无更多数据';
		// 	}
		// },
		// onPullDownRefresh() {
		// 	uni.startPullDownRefresh({
		// 		//API开始下拉刷新操作
		// 		success: res => {
		// 			console.log('shuacin', this.fetchPageNum);
		// 			this.refreshing = true;
		// 			this.getServerData(); //下拉刷新重新获取数据
		// 			uni.stopPullDownRefresh(); //API停止下拉刷
		// 		}
		// 	});
		// },
		methods: {
			// pulllists() {
			// 	this.checklist = [];
			// 	_self = this;
			// 	uni.request({
			// 		url: this.$serverUrl + '/app/hospital/patient/checkChart',
			// 		data: {
			// 			subjectId: _self.subId,
			// 			patientId: _self.patId,
			// 			pageNumber: _self.pageNumber,
			// 			pageSize: _self.pageSize
			// 		},
			// 		method: "POST",
			// 		header: {
			// 			'token': uni.getStorageSync('token'),
			// 			'content-type': "application/json",
			// 			'content-type': "application/x-www-form-urlencoded"
			// 		},
			// 		success: (res) => {
						
			// 			if (res.data.code == 0) {
			// 				console.log(res.data);
			// 				if (this.refreshing) {
			// 					uni.showToast({
			// 						title: '已经最新',
			// 						icon: 'none'
			// 					});
			// 					this.refreshing = false;
			// 					uni.stopPullDownRefresh();

			// 					return;
			// 				}

			// 				let lists = [];
			// 				let data = res.data.data;
			// 				var Aser = []
			// 				for (var key in data) {
			// 					var checktime = [];
			// 					var results = [];
			// 					for (var key2 in data[key]) {
			// 						checktime.push(data[key][key2].checkTime);
			// 						results.push(data[key][key2].result)

			// 					}
			// 					var series = [];
			// 					var serie = {};
			// 					serie.name = res.data.data[key][0].cheakName;
			// 					serie.data = results
			// 					series.push(serie)
			// 					var opts = {};
			// 					if (res.data.data[key][0].calculateType == 2) {
			// 						opts.type = 2
			// 						opts.min = 0
			// 						opts.max = 5
			// 					} else if (res.data.data[key][0].calculateType == 1) {
			// 						opts.min = res.data.data[key][0].value.split("~")[0]
			// 						opts.max = res.data.data[key][0].value.split("~")[1]
			// 						opts.type = 1
			// 					}
			// 					opts.categories = checktime;
			// 					opts.series = series;
			// 					opts.canvasId = "" + key;
			// 					var final = {};
			// 					final.opts = opts;
			// 					final.chartType = "line";
			// 					final.id = "" + key;
			// 					var arr = [];
			// 					arr.push(final)
			// 					Aser.push(arr)
			// 				}

			// 				if (Aser.length < this.pageSize) {
			// 					this.pullFlag = false;
			// 				}
							
			// 				console.log('得到Aser', Aser);
			// 				this.checkList = this.checkList.concat(lists);
						
			// 			}
			// 			console.log(JSON.stringify(Aser))
			// 		},
			// 	})
			// },
		
	
	
	getServerData() {
			this.checklist = [];
			_self = this;
			uni.request({
				url: this.$serverUrl + '/app/hospital/patient/checkChart',
				data: {
					subjectId: _self.subId,
					patientId: _self.patId,
					pageNumber: 1,
					pageSize: 10
				},
				method: "POST",
				header: {
					'token': uni.getStorageSync('token'),
					'content-type': "application/json",
					'content-type': "application/x-www-form-urlencoded"
				},
				success: (res) => {
					
					if (res.data.code == 0) {
						console.log(res.data);
						// if (this.refreshing) {
						// 	uni.showToast({
						// 		title: '已经最新',
						// 		icon: 'none'
						// 	});
						// 	this.refreshing = false;
						// 	uni.stopPullDownRefresh();

						// 	return;
						// }

						// let lists = [];
						let data = res.data.data;
						var Aser = []
						for (var key in data) {
							var checktime = [];
							var results = [];
							for (var key2 in data[key]) {
								checktime.push(data[key][key2].checkTime);
								results.push(data[key][key2].result)

							}
							var series = [];
							var serie = {};
							serie.name = res.data.data[key][0].cheakName;
							serie.data = results
							series.push(serie)
							var opts = {};
							if (res.data.data[key][0].calculateType == 2) {
								opts.type = 2
								opts.min = 0
								opts.max = 5
							} else if (res.data.data[key][0].calculateType == 1) {
								opts.min = res.data.data[key][0].value.split("~")[0]
								opts.max = res.data.data[key][0].value.split("~")[1]
								opts.type = 1
							}
							opts.categories = checktime;
							opts.series = series;
							var final = {};
							final.opts = opts;
							final.chartType = "line";
							final.id = "" + key;
							var arr = [];
							arr.push(final)
							Aser.push(arr)
						}

						// if (Aser.length < this.pageSize) {
						// 	this.contentText = '暂无更多数据';
						// }
						// this.Aser = res.data.data;
						// console.log('得到Aser', Aser);
						// if (this.refreshing) {
						// 	this.refreshing = false;
						// 	uni.stopPullDownRefresh();
						// 	this.checkList = Aser;
						// } else {
						// 	this.checkList = Aser;
						// 	console.info('this.fetchPageNum == ' + this.fetchPageNum);
							
						// 	console.log(this.checkList);
						// }
					}
					console.log(JSON.stringify(Aser))
					this.checklist = Aser
				},
			})
		},
},
	onNavigationBarButtonTap(e) {
		if (e.index == 0) {
			uni.navigateTo({
				url: '/pages/patientmanage/Renal'

			})
		}
	}
	}
</script>

<style>
	/*样式的width和height一定要与定义的cWidth和cHeight相对应*/
	.qiun-charts {
		width: 750upx;
		height: 500upx;
		background-color: #FFFFFF;
		margin-bottom: 100upx;
	}

	.charts {
		width: 750upx;
		height: 500upx;
		background-color: #FFFFFF;
	}

	.mone {
		background-color: #09BB07;
	}
</style>
